<template>
  <div style="margin-top:30px">
    <el-form ref="form" :model="form" label-width="80px" style="margin-bottom:10px">
      <span>货品编码 &nbsp;&nbsp;&nbsp;:&nbsp;&nbsp;&nbsp;{{form.goodCode}} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;货品条码 &nbsp;&nbsp;&nbsp;:&nbsp;&nbsp;&nbsp;{{form.goodsBarCode}} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;货品名称 &nbsp;&nbsp;&nbsp;:&nbsp;&nbsp;&nbsp;{{form.goodsName}} </span>
    </el-form>
    <vxe-table
      border
      resizable
      show-overflow
      ref="xTable"
      :data="tableData"
      show-footer
      :edit-config="{trigger: 'click', mode: 'cell'}">
      <vxe-table-column field="warehouseSpaceName" title="库区"  width="120"></vxe-table-column>
      <vxe-table-column field="locationName" title="库位"  width="120"></vxe-table-column>
      <vxe-table-column field="inventoryQuantity" title="库存数量"  width="120"></vxe-table-column>
      <vxe-table-column field="distributionQuantity" title="分配数量" :edit-render="{name: 'input'}"  width="120" ></vxe-table-column>
      <vxe-table-column field="gmtManufacture" title="生产日期"  width="120"></vxe-table-column>
      <vxe-table-column field="gmtExpire" title="过期日期" width="120" ></vxe-table-column>
      <vxe-table-column field="gmtStock" title="存货日期"   width="120"></vxe-table-column>
      <vxe-table-column field="containerBarCode" title="容器号" width="120"></vxe-table-column>
      <vxe-table-column field="receiveLot" title="收货批次" width="120"></vxe-table-column>
      <vxe-table-column field="goodsStatusName" title="库存状态"  width="120" ></vxe-table-column>
      <vxe-table-column field="isLock" title="锁定状态"  width="120" :formatter="formatterIsLock"></vxe-table-column>
    </vxe-table>

    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="funcSubmit" :disabled="isDisable" plain>保 存</el-button>
    </div>
  </div>
</template>
<script>
import Vue from 'vue'
import 'xe-utils'
import VXETable from 'vxe-table'
import 'vxe-table/lib/index.css'
import request from '@/utils/request'
import { goodsUnitConversion, receiveCheckSubmit ,receiveRegisterAdd, getReceiveRegister} from '@/api/inStorage'
import {queryInventory, deliveryDistributionCheckSubmit} from '@/api/outStorage'

Vue.use(VXETable)
export default {
  data() {
    return {
      tableData:[],
      isDisable:false,                                                                          //确定键显示按钮

      form: {
        code:'',              //数据标识 ,
        gmtExpire:'',              //过期日期 ,
        gmtManufacture:'',              //生产日期 ,
        gmtExpire:'',
        gmtStock:'',
        goodsBarCode:'',              //商品条码 ,
        goodsCode:'',              //商品编码 ,
        goodsName:'',              //商品名称 ,
        inventoryWithDistributionVOList:[],
        goodsUnitName:'',              //单位 ,
        planQuantity:'',              //计划数量 ,
        receiveCode:'',              //收货单号 ,
        receivedQuantity:'',              //收货数量 ,
        refundQuantity:'',              //退货数量 ,
        remarks:'',              //备注 ,
        status:'',              //状态
      },
    }
  },
  created() {
  },
  methods: {
    // 翻译锁定状态
    formatterIsLock({ cellValue }) {
      if (cellValue == '0') {
        return '否'
      }
      if (cellValue == '1') {
        return '是'
      }

    },

    // 获取页面信息
    getInfo(code) {
      queryInventory(code).then(response => {
        this.form = response.data
        this.tableData = response.data.inventoryWithDistributionVOList
        this.tableData.forEach( i => {
          i.inventoryQuantity = i.quantity - i.useQuantity
        })
      })
    },
    // 提交
    funcSubmit() {
      this.isDisable = true
      this.form.inventoryWithDistributionVOList = this.$refs.xTable.tableData
      const data = this.form
      let a = ''
      for (let i of this.form.inventoryWithDistributionVOList) {
        if(i.distributionQuantity > i.inventoryQuantity || i.distributionQuantity < 0){
          this.$message.error('分配数量不可大于库存数量且不可为负')
          a =1
          break;
          this.isDisable = false
        }else{
          a = 0
        }
      }
      if(a == 0){
        deliveryDistributionCheckSubmit(data).then(response => {

          this.$message({ message: response.msg, type: 'success' })
          this.$emit('fatherEditMethod')
          this.isDisable = false
        }).finally(()=>{
          this.isDisable = false
        })
      } else {
        this.isDisable = false
      }
    },

    // 取消
    funcCancel() {
      this.$emit('fatherCancelMethod', 'edit')
    }

  }
}
</script>
<style lang="scss" scoped >
  .dialog-footer {
    margin: 15px 0 15px 0;
    width: 90px;
    float: right;
  }
</style>
